<template>
	<ComIndex ref="commonIndexRef" :toggleView="false" :showFilter="false" :params="{ dataType: tabValue, keywords, menuType }" :isInitList="false" :initApi="false" :getListFun="ApiFieldsList">
		<template #search>
			<Search :showSearch="false" >
				<template #right>
					<i :class="['EachApp', 'EachApp_jian1', 'hover']" @click="tableRef?.handleBtn('add')"></i>
				</template>
			</Search>
		</template>
		<div class="base-padding h100" style="padding: 10px">
			<ComTips title="组织管理" tips="企业组织部门、用户、岗位等基础数据维护"></ComTips>
			<!-- <ComTabs style="margin-bottom: 10px" v-model="tabValue" :card="false" :options="ORG_TYPE" @change="comSearchRef.searchKey = ''; treeRef?.changeTabs($event)" v-if="isChecked">
				<ComSearch :isIcon="false" @handleSearch="tableRef.handleBtn('search', $event)" width="300px" ref="comSearchRef"></ComSearch>
			</ComTabs> -->
			<div class="team-manage">
				<Tree ref="treeRef"/>
				<Table ref="tableRef"/>
			</div>
		</div>
	</ComIndex>
</template>
<script lang="ts" setup>
import ComIndex from "@/components/ComIndex/Index.vue";
import ComTips from "@/components/ComTips.vue";
import Search from "@/components/ComIndex/Search.vue";
import ComTabs from "@/components/ComTabs.vue";
import Tree from './components/Tree.vue';
import Table from './components/Table.vue';
import { ORG_TYPE } from "@/utils/filter";
import mitt from '@/utils/bus';
const tabValue = ref('dept');
const treeRef = ref(null);
const tableRef = ref(null);
const comSearchRef = ref(null);
const isChecked = ref(false);

onUnmounted(() => {
	mitt.all.clear();
})

const checkUser = (val) => {
	console.log('val=====', {...val});
	tabValue.value = 'dept';
	treeRef.value.changeTabs('dept', val);
}

const handleCheck = (e) => {
	isChecked.value = e;
}

provide('checkUser', checkUser);
provide('isChecked', handleCheck);
provide('tabValue', tabValue.value);


</script>
<style lang="scss" scoped>
.base-padding{
	height: 100%;
	:deep(.team-manage){
		display: flex;
		height: calc(100% - 67px);
		position: relative;
		border-top: 1px solid #f1f1f1;
		.tree{
			width: 220px;
			border-right: 1px solid #f1f1f1;
			overflow: auto;
		}
		.table{
			width: calc(100% - 220px);
			cursor: initial;
			padding: 10px 0 10px 10px;
		}
	}
	// :deep(.tabs_box){
	// 	height: 37px;
	// }
}
</style>
